<template>
  <div class="header_container">
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/manage' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item v-for="(item, index) in $route.meta" :key="index">{{item}}</el-breadcrumb-item>
    </el-breadcrumb>
    <el-dropdown  menu-align='start'>
      <img src="../../assets/img/avator.jpg" class="avator"/>
      <!--<img :src="baseImgPath + adminInfo.avatar" class="avator">-->
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item command="home">首页</el-dropdown-item>
        <el-dropdown-item command="signout">
          <a @click="signout">退出</a></el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
  </div>
</template>

<script>
  import { getCookie,delCookie } from '../../assets/js/cookie';
  export default {
   name: 'head-top',
    data() {
     return{
       adminName: '',
       adminPassword: '',
     }
    },
    methods: {
     signout() {
       if(getCookie('adminName')){
         delCookie('adminName');
         this.$router.push('/admin');
         this.$message.success('您已成功退出后台管理系统。');
       } else {
         this.$message.warning('网络延迟，请稍后。。。');
       }
     }
    }
 }

</script>

<style lang="less">
  @import '../../style/mixin';
  .header_container{
    background-color: #EFF2F7;
    height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 20px;
  }
  .avator{
  .wh(36px, 36px);
    border-radius: 50%;
    margin-right: 37px;
  }
  .el-dropdown-menu__item{
    text-align: center;
  }
</style>
